import React, { useEffect, useState } from 'react';
import { Layout, Space } from 'antd';
import Search from './Search';
import { history } from 'umi';
import Title from './Title';
import BlockDetailsForm from './BlockDetailsForm';
const { Header, Footer, Content } = Layout;
const headerStyle = {
  zINdex: '997',
  marginBottom: '20px',
  textAlign: 'left',
  color: '#fff',
  height: 45,
  paddingInline: 0,
  backgroundColor: '#f0f2f5',
};
const contentStyle = {
  width: '100%',
  height: '74px',
  margin: '25px',
  marginBottom: '20px',
  textAlign: 'center',
  backgroundColor: '#fff',
  boxShadow: '0 2px 4px 0 rgba(0,0,0,.1)',
};
const footerStyle = {
  width: '100%',
  color: '#fff',
  padding: '0',
};

// if(history.location.search) {
//   history.location.search.split('=')
// }

const Detail2 = () => {
  const [defaultText, setDefaultText] = useState('');
  useEffect(() => {
    // console.log(history?.location?.search?.split('='));
    setDefaultText(history?.location?.search?.split('=')?.[1]);
  }, [history?.location?.search]);

  const Onsearch = (value) => {
    // Perform search logic here, and set dataFound accordingly
    if (value === 'NoDataFound') {
      setDataFound(false);
    } else {
      setDataFound(true);
    }
  };
  return (
    <Space
      direction="vertical"
      style={{
        width: '100%',
        backgroundColor: '#f0f2f5',
      }}
      size={[0, 48]}
    >
      <Layout>
        <Header style={headerStyle}>
          <Title></Title>
        </Header>
        <Content style={contentStyle}>
          <Search defaultText={defaultText} idea={setDefaultText}></Search>
        </Content>
        <Footer style={footerStyle}>
          <BlockDetailsForm defaultText={defaultText}></BlockDetailsForm>
        </Footer>
      </Layout>
    </Space>
  );
};
export default Detail2;
